<template>
  <div class="aui-card-list">
    <uni-list-query-card :queryShow="queryShow" @query-click="getDataList()" @click="(e)=>{this.queryShow=e}"
      @searchReset="searchReset()">
      <el-col :span="6">
        <el-form-item label="预警项编码">
          <el-input v-model="dataForm.eventCode" placeholder="预警项编码" clearable></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="预警项名称">
          <el-input v-model="dataForm.eventName" placeholder="预警项名称" clearable></el-input>
        </el-form-item>
      </el-col>
    </uni-list-query-card>
    <el-card shadow="never" class="aui-card-list-body">
      <vxe-toolbar :custom="{immediate:true}">
        <template v-slot:buttons>
          <el-button v-if="$hasPermission('msg:msgBizEvent:save')" type="primary" @click="addOrUpdateHandle()">{{
            $t('add') }}</el-button>
          <el-button v-if="$hasPermission('msg:msgBizEvent:delete')" type="danger" @click="deleteHandle()">{{
            $t('deleteBatch') }}</el-button>
        </template>
        <template v-slot:tools>
          <el-button icon="el-icon-refresh" @click="getDataList()" circle></el-button>
          <el-dropdown trigger="click" style="padding-left: 5px;" placement="bottom">
            <el-button icon="el-icon-download" circle>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item icon="el-icon-bottom" @click.native="exportHandle(true)">导出当前页</el-dropdown-item>
              <el-dropdown-item icon="el-icon-download" @click.native="exportHandle()">全部导出
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </vxe-toolbar>
      <div class="aui-card-list-body-table">
        <!--  锁定表头设置   :height="this.tableHeight" -->
        <vxe-table ref="xTable" :loading="dataListLoading" class="vxe-table-element" auto-resize :sort-config="{trigger:'cell'}"
          @sort-change="sortChange" @select-change="dataListSelectionChangeHandleVex" @select-all="dataListSelectionAllChangeHandleVex"
          :data="dataList">
          <vxe-table-column type="checkbox" width="60" align="center"></vxe-table-column>
          <vxe-table-column field="eventCode" title="预警项编码" width="120">
          </vxe-table-column>
          <vxe-table-column field="eventName" title="预警项名称" min-width="150">
          </vxe-table-column>
          <vxe-table-column field="msgProducerType" title="事件产生方式" width="120" align="center">
            <template slot-scope="scope">
              {{$getDictLabel('MSG_PRODUCER_TYPE', scope.row.msgProducerType)}}
            </template>
          </vxe-table-column>
          <!-- <vxe-table-column field="msgJobType" title="JOB的配置方式">
        <template slot-scope="scope">
          {{$getDictLabel('MSG_JOB_TYPE', scope.row.msgJobType)}}
        </template>
      </vxe-table-column> -->
          <!-- <vxe-table-column field="msgJobSql" title="SQL">
      </vxe-table-column>
      <vxe-table-column field="msgJobBean" title="Java Bean">
      </vxe-table-column>
      <vxe-table-column field="msgJobMethod" title="Method">
      </vxe-table-column> -->
          <vxe-table-column field="pushType" title="预警消息" width="100" align="center">
            <template slot-scope="scope">
              {{$getDictLabel('MSG_PUSH_TYPE', scope.row.pushType)}}
            </template>
          </vxe-table-column>
          <!-- <vxe-table-column field="updater" title="更新者" width="120" align="center">
          </vxe-table-column> -->
          <vxe-table-column field="updateDate" title="更新时间" width="150" align="center">
          </vxe-table-column>
          <vxe-table-column title="handle" width="180" show-overflow="false" fixed="right" align="center">
            <template slot-scope="scope">
              <el-button type="text" size="small" icon="el-icon-s-grid" @click="openRuleWin(scope.row)">配置</el-button>
              <el-button v-if="$hasPermission('msg:msgBizEvent:update')" type="text" size="small" icon="el-icon-edit"
                @click="addOrUpdateHandle(scope.row)">{{ $t('update') }}</el-button>
              <el-button v-if="$hasPermission('msg:msgBizEvent:delete')" type="text" size="small" icon="el-icon-delete"
                @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
            </template>
          </vxe-table-column>
        </vxe-table>
        <el-pagination :current-page="page" :page-sizes="pageSizes" :page-size="limit" :total="total" layout="total, sizes, prev, pager, next, jumper"
          @size-change="pageSizeChangeHandle" @current-change="pageCurrentChangeHandle">
        </el-pagination>
        <rule-win ref="ruleWin" @select="ruleSelect"></rule-win>
      </div>
    </el-card>
  </div>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import RuleWin from './msgBizEvent-rule-win'

export default {
  mixins: [mixinViewModule],
  data () {
    return {
      searchShow: true,
      mixinViewModuleOptions: {
        getDataListURL: '/msg/msgBizEvent/page',
        getDataListIsPage: true,
        deleteURL: '/msg/msgBizEvent',
        deleteIsBatch: true,
        exportURL: '/msg/msgBizEvent/export'
      },
      headLock: false,
      dataForm: {
        eventClass: '',
        eventCode: '',
        eventName: ''
      }
    }
  },
  components: {
    RuleWin
  },
  created () {
    let params = this.$route.params
    if (params.eventClass) {
      this.dataForm.eventClass = params.eventClass
    }
  },
  methods: {
    ruleSelect (row, pushType) {
      this.openRuleHandle(row, pushType)
    },
    // 根据预警项 是否立即推送消息 打开窗口，循环消息选择规则
    openRuleWin (row) {
      let ref = this.$refs.ruleWin
      ref.dataForm.eventCode = row.eventCode
      ref.getDataList().then((data) => {
        if (data.length === 1) {
          this.ruleSelect(data[0], row.pushType)
        } else {
          ref.visible = true
        }
      })
    },
    // 新增 / 修改
    addOrUpdateHandle (row) {
      let title = '新增'
      let id
      if (row) {
        title = '编辑'
        id = row.id
      }
      // 打开路由
      var router = {
        name: 'msg-msgBizEvent-editForm',
        id: id || this.dataForm.eventClass,
        menuId: this.$route.meta.menuId,
        oldName: 'msg-msgBizEvent',
        path: 'msg/msgBizEvent-editForm',
        title: title + '预警项定义'
      }
      var params = {
        timestamp: this.$xeutils.timestamp(),
        id: id,
        eventClass: this.dataForm.eventClass
      }
      this.$options.methods.openNewTab(this.$router, router, params)
    },
    // 通过规则row打开规则配置页面
    openRuleHandle (row, pushType) {
      // 打开路由
      var router = {
        name: 'msg-msgBizRule-editForm',
        id: row.id,
        menuId: this.$route.meta.menuId,
        oldName: 'msg-msgBizEvent',
        path: 'msg/msgBizRule-editForm',
        title: pushType === '0' ? '预警项配置' : '规则配置'
      }
      var params = {
        timestamp: this.$xeutils.timestamp(),
        id: row.id,
        eventClass: this.dataForm.eventClass,
        pushType: pushType
      }
      // console.log(1, params)
      this.$options.methods.openNewTab(this.$router, router, params)
    }
  }
}
</script>
